// function Page(el,opations={}){
//     this.el = document.querySelector(el)
//     this.opations = opations
   
//     this.init()
// }
// Page.prototype.init = function(){
//     //点击事件
//     this.onclickevent()
//     //创建标签
//     this.creatTitle()
//     //创建页码
    
//     //创建p标签冗余
//     // this.publiccreatp()
//     //默认选中

//     //页数分配

// }
// Page.prototype.onclickevent = function(){
//     //获取所有
//     this.el.onclick = (evt)=>{
//         let e = evt || window.event
//         let target = e.target || e.srcElement
//         if(target.nodeName === 'P'){
//             switch (target.innerText) {
//                 case this.opations.pageTag.first:
//                     this.opations.pageInfo.pagenum = 1  
//                     break;
//                 case this.opations.pageTag.prev:
//                     if(this.opations.pageInfo.pagenum == 1 ) return
//                     this.opations.pageInfo.pagenum --  
//                     break;
//                 case this.opations.pageTag.next:
//                     if(this.opations.pageInfo.pagenum == this.opations.pageInfo.totalPage) return
//                     this.opations.pageInfo.pagenum ++  
//                     break;
//                 case this.opations.pageTag.last:
//                     this.opations.pageInfo.pagenum = this.opations.pageInfo.totalPage 
//                     break;
//                 default:
//                     if(parseInt(target.innerText)>0){
//                         this.opations.pageInfo.pagenum = parseInt(target.innerText)  
//                     }
//                     break;
//             }
//             this.creatTitle()
//         }
//     }
// }

// Page.prototype.creatTitle = function(){

//     this.el.innerHTML =''
//     let pageTag1 = this.opations.pageTag
//     // console.log(pageTag1);
    
//     for (const key in pageTag1) {
//         this.publiccreatp('p',pageTag1[key],this.el)
//     }
//     this.creatpage()
// }
// Page.prototype.creatpage = function(){
//      let pagethree = this.el.querySelector('p:nth-of-type(3)')
//     // let pagethree = this.opations.pageTag.list
//     //微调去除边框
//     pagethree.style.border = ''
//     // for (let i = 1; i < 6; i++) {
//     //     this.publiccreatp('p',i,pagethree)
//     //     // if(i = nowTitle) titleObj.backgroundColor = 'orange'
//     // }
//     let pagename = this.opations.pageInfo.pagenum
//     this.opations.pageInfo.totalPage =Math.ceil(this.opations.pageInfo.totalDate / this.opations.pageInfo.pageSize) 
//     let pageTotle = this.opations.pageInfo.totalPage
//     if(pageTotle<7){
//         for (let i = 1; i <= pageTotle; i++) {
//             this.publiccreatp('p',i,pagethree)
//             }
//     }else if(pagename<5) {
//        for (let i = 1; i < 6; i++) {
//         this.publiccreatp('p',i,pagethree)
//         }
//         this.publiccreatp('p','...',pagethree)
//         for (let i = pageTotle-1; i <= pageTotle; i++) {
//             this.publiccreatp('p',i,pagethree)
//         }
//     }else if(pagename==5){
//         for (let i = 1; i < 8; i++) {
//             this.publiccreatp('p',i,pagethree)
//             }
//             for (let i = pageTotle-1; i <= pageTotle; i++) {
//                 this.publiccreatp('p',i,pagethree)
//             }
//     }else if(pagename>5 && pagename<pageTotle-4){
//         for (let i = 1; i <3; i++) {
//             this.publiccreatp('p',i,pagethree)
//             }
//         this.publiccreatp('p','...',pagethree)
//         for (let i = pagename-2; i < pagename+2; i++) {
//             this.publiccreatp('p',i,pagethree)
//         }
//         this.publiccreatp('p','...',pagethree)
//         for (let i = pageTotle-1; i <= pageTotle; i++) {
//             this.publiccreatp('p',i,pagethree)
//         }
//     }
//     else if(pagename>=pageTotle-4){
//         for (let i = 1; i <3; i++) {
//             this.publiccreatp('p',i,pagethree)
//             }
//         this.publiccreatp('p','...',pagethree)
//         for (let i = pageTotle-4; i <= pageTotle; i++) {
//             this.publiccreatp('p',i,pagethree)
//         }
//     }
// }
// Page.prototype.publiccreatp = function(pagetitle,content,parentTitle){
//     titleObj = document.createElement(pagetitle)
//     titleObj.innerText = content
//     titleObj.style.border = '1px solid black'
//     titleObj.style.display = 'inline-block'
//     titleObj.style.margin = '7px'
//     titleObj.style.paddingLeft='5px'
//     titleObj.style.paddingRight='5px'
//     parentTitle.appendChild(titleObj)
//     let nowTitle = this.opations.pageInfo.pagenum
//     if(content ==nowTitle) titleObj.style.backgroundColor = 'orange'
// }




//分页器第二遍
//面向对象
function Page(el,opations){
    this.el = document.querySelector(el)
    this.opations = opations
    this.init()
}
Page.prototype.init = function(){
    //创建标签
    this.creatTitle()
    
    //点击切换页码
    this.pageChange()
}
Page.prototype.creatTitle = function(){
    //清空所有值
    this.el.innerHTML = ''
    //获取pageTag的值
    // console.log(titleObj);
    let pageTag = this.opations.pageTag
    for (const key in pageTag) {
        this.publicP('P',pageTag[key],this.el)
    }
   //创建页码
   this.creatP() 
}
Page.prototype.creatP = function(){
    //获取第三个p标签
    let threeP = this.el.querySelector('P:nth-of-type(3)')
    let pagenum = this.opations.pageInfo.pagenum
    this.opations.pageInfo.totalPage = Math.ceil(this.opations.pageInfo.totalDate/this.opations.pageInfo.pageSize)
    let totalpage = this.opations.pageInfo.totalPage
    console.log(totalpage);
    


    // for (let i = 0; i < 6; i++) {
    //     this.publicP('P',i,threeP)
    // }
    if(totalpage<7){
        for (let i = 1; i < totalpage; i++)  this.publicP('P',i,threeP) 

    }else if(pagenum<5){
        for (let i = 1; i < 6; i++)  this.publicP('P',i,threeP) 
        this.publicP('P','...',threeP)
        for (let i = totalpage-1; i <= totalpage; i++) this.publicP('P',i,threeP) 
    }else if(pagenum==5){
        for (let i = 1; i < 8; i++)  this.publicP('P',i,threeP) 
        this.publicP('P','...',threeP)
        for (let i = totalpage-1; i <= totalpage; i++) this.publicP('P',i,threeP) 
    }else if(pagenum>5 && pagenum<totalpage-5){
        for (let i = 1; i < 3; i++)  this.publicP('P',i,threeP) 
        this.publicP('P','...',threeP)
        for (let i = pagenum-2; i <=pagenum+2; i++)  this.publicP('P',i,threeP) 
        this.publicP('P','...',threeP)
        for (let i = totalpage-1; i <= totalpage; i++) this.publicP('P',i,threeP) 
    }else if(pagenum>=totalpage-5){
        for (let i = 1; i < 3; i++)  this.publicP('P',i,threeP) 
        this.publicP('P','...',threeP)
        for (let i = totalpage-5; i <= totalpage; i++) this.publicP('P',i,threeP) 
    }
    
    //pagenum<5   1  2  3  4  5 ...  99 100
    //pagenum=5   1  2 3 4 5 6 7 ... 99 100
    //pagenum>5  && pagenum<totalpage-5  1  2 ...pagenum-2 pagenum-1 pagenum pagenum+1 pagenum+2 ... 99 100
    //pagenum>totalpage-5  1  2 ... ...95 96 97 98 99 100
}
//封装公共代码
Page.prototype.publicP = function(titlepage,content,parentpage){
    
    let titleObj = document.createElement(titlepage)
        titleObj.innerText = content
        titleObj.style.display = 'inline-block'
        titleObj.style.marginLeft='10px'
        titleObj.style.marginRight='10px'
        titleObj.style.marginTop='8px'
        titleObj.style.Height = '50px'
        titleObj.style.padding = '0 7px'
        parentpage.appendChild(titleObj)
        if(content === this.opations.pageInfo.pagenum) {
            titleObj.style.backgroundColor = 'orange' 
        }
    }
Page.prototype.pageChange = function(){
    //对后续添加的事件需要用到事件委托
    this.el.onclick = (evt)=>{
        let e = evt || window.event
        let target = e.target || e.srcElement
        if(target.nodeName ==='P'){
            switch (target.innerText) {
                case this.opations.pageTag.first:
                    this.opations.pageInfo.pagenum = 1
                    break;
                case this.opations.pageTag.last:
                    this.opations.pageInfo.pagenum = this.opations.pageInfo.totalPage
                    break;
                case this.opations.pageTag.prev:
                if(this.opations.pageInfo.pagenum == 1) return
                    this.opations.pageInfo.pagenum--
                    break;
                case this.opations.pageTag.next:
                if(this.opations.pageInfo.pagenum == this.opations.pageInfo.totalPage) return
                this.opations.pageInfo.pagenum++
                    break;
                default:
                if(parseInt(target.innerText)>0){
                    this.opations.pageInfo.pagenum = parseInt(target.innerText)
                }
                    break;
            }
            this.creatTitle()
        }
    }
}